<template>
  <view>
    <view class="background">
      <view class="w">
        <select style="border: none;font-size: 30rpx; font-weight: 700;background-color:rgb(240, 240, 240) ;height: 105rpx;">
          <option>请选择</option>
          <option>清水湾1号楼1单元2203</option>
          <option>清水湾1号楼1单元2204</option>
        </select>
        <view class="nav">
          <h3 style="color: #FFFFFF;text-align: center;line-height: 207rpx;">应缴费：360.00元</h3>
          <navigator url="/pages/fee/fee">
          <button style="width:285rpx;height: 85rpx; background-color: #FFFFFF;color:rgb(18, 168, 242);border-radius: 45rpx;">缴费</button>
          </navigator>
        </view>
        <view class="footer">
          <view class="ww">
            <view style="line-height: 80rpx; border-bottom: 1px solid #eeeeee;">物业费账单</view>
            <view class="left">
              <text>房号</text>
              <text>账单</text>
              <text>账单金额</text>
            </view>
            <view class="right">
              <text>1201</text>
              <text>2021-8-1至2021-10-1</text>
              <text>￥360.00元</text>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
      }
    },
    onLoad() {

    },
    methods: {
      
    },
    onNavigationBarButtonTap(e) {
            
            
            if(e.index==0){
              
              console.log("你点击了 添加按钮")
              uni.navigateTo({
                url:"./list"
              })
            }
            if(e.index==1){
              
              console.log("你点击了 分享按钮")
            }
            
          }
  }
</script>

<style>
  .w{
    width:730rpx;
    margin:0 auto;
    height:1665rpx;
  }
  .background{
    background-color:rgb(240, 240, 240) ;
  }
  .nav{
    height:327rpx;
    border-radius: 15rpx;
    background:linear-gradient(90deg,#0177ff 0%,#009ffd 50%,#00c6fd 70%);
  }
  .footer{
    background-color: #FFFFFF;
    height:330rpx;
    margin-top:20rpx;
  }
  .ww{
    width:660rpx;
    margin-left:40rpx;
  }
  .footer .left text{
    display: block;
    line-height: 70rpx;
  }
  .footer .left{
    text-align: left;
    float:left;
  }
  .footer .right{
    text-align: right;
  }
  .footer .right text{
    display: block;
    line-height: 70rpx;
  }
</style>